import 'dart:async';

import 'package:flutter/material.dart';
import 'package:top_foundation/utils/theme/theme.dart';

import '../../../../helper/utils/util.dart';

class ICodeField extends StatefulWidget {
  const ICodeField({
    Key? key,
    required this.smsClickListener,
    this.isLineStyle = true,
    this.fillColor,
    this.maxLength = 6,
    this.errText,
    this.onChange,
    this.border,
    this.margin,
    this.focusNode,
  }) : super(key: key);
  final Future<bool> Function() smsClickListener;
  final bool isLineStyle;
  final Color? fillColor;
  final int maxLength;
  final String? errText;
  final Function(String)? onChange;
  final InputBorder? border;
  final double? margin;
  final FocusNode? focusNode;
  @override
  _ICodeFieldState createState() => _ICodeFieldState();
}

class _ICodeFieldState extends State<ICodeField> {
  final codeCtrl = TextEditingController();
  String actionText = '获取验证码';
  int timeCount = 60;
  Timer? timer;
  bool isSending = false;

  @override
  void initState() {
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
    timer?.cancel();
    codeCtrl.dispose();
  }

  void sendAction() async {
    if (isSending) {
      return;
    }

    bool b = await widget.smsClickListener();

    if (!b) {
      return;
    }
    isSending = true;
    timer = Timer.periodic(const Duration(seconds: 1), (_) {
      if (timeCount == 0) {
        isSending = false;
        timer?.cancel();
        timeCount = 60;
        actionText = '获取验证码';
      } else {
        timeCount--;
        actionText = '${timeCount}s';
      }
      setState(() {});
    });
  }

  @override
  Widget build(BuildContext context) {
    return TextField(
      controller: codeCtrl,
      maxLength: widget.maxLength,
      keyboardType: TextInputType.number,
      textAlignVertical: TextAlignVertical.center,
      maxLines: 1,
      onTap: () {
        if (widget.onChange != null) {
          widget.onChange!('');
        }
      },
      onChanged: (value) {
        if (widget.onChange != null) {
          widget.onChange!(value);
        }
      },
      style: TextStyle(color: const Color(0xff333333), fontSize: 16.sp),
      decoration: InputDecoration(
        isCollapsed: true,
        counterText: '',
        errorText: widget.errText,
        filled: !widget.isLineStyle,
        fillColor: widget.fillColor ?? const Color(0xfffafafa),
        suffixIcon: InkWell(
            onTap: sendAction,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              mainAxisSize: MainAxisSize.min,
              children: [
                Container(
                  margin: widget.isLineStyle
                      ? null
                      : EdgeInsets.only(right: widget.margin ?? 10.r),
                  padding: !widget.isLineStyle
                      ? EdgeInsets.zero
                      : EdgeInsets.all(8.r),
                  decoration: widget.isLineStyle
                      ? null
                      : BoxDecoration(
                          color: ColorsUtil.blue,
                          borderRadius: BorderRadius.circular(5),
                        ),
                  child: Text(
                    actionText,
                    style: TextStyle(
                        color: isSending
                            ? const Color(0xffDFDFDF)
                            : (widget.isLineStyle
                                ? const Color(0xff004DB6)
                                : Colors.white),
                        fontSize: 14.sp),
                  ),
                ),
              ],
            )),
        hintText: '请输入验证码',
        hintStyle: TextStyle(color: const Color(0xffbbbbbb), fontSize: 16.sp),
        contentPadding: widget.isLineStyle
            ? EdgeInsets.zero
            : EdgeInsets.only(left: widget.margin ?? 10.r),
        errorBorder: widget.border ??
            (widget.isLineStyle
                ? const UnderlineInputBorder(
                    borderSide: BorderSide(color: Colors.red, width: 0.5),
                    borderRadius: BorderRadius.zero)
                : OutlineInputBorder(
                    borderRadius: BorderRadius.circular(10),
                    borderSide: const BorderSide(color: Colors.red, width: 0.5),
                  )),
        enabledBorder: widget.border ??
            (widget.isLineStyle
                ? UnderlineInputBorder(
                    borderSide: ITheme.borderSide,
                    borderRadius: BorderRadius.zero)
                : OutlineInputBorder(
                    borderRadius: BorderRadius.circular(10),
                    borderSide: const BorderSide(color: Colors.red, width: 0.5),
                  )),
        focusedBorder: widget.border ??
            (widget.isLineStyle
                ? const UnderlineInputBorder(
                    borderSide: BorderSide(color: ColorsUtil.blue),
                    borderRadius: BorderRadius.zero)
                : OutlineInputBorder(
                    borderRadius: BorderRadius.circular(10),
                    borderSide:
                        const BorderSide(color: ColorsUtil.blue, width: 0.5),
                  )),
      ),
    );
  }
}
